<template>
    <h2>门店修改页面</h2>
    <table border="1">
     <tr>
        <td>门店照片</td>
        <td>
            <img style="width:100px;height:100px;" :src="shop.Shop_Img"/>
            <input type="file" @change="fileUpLoad">
        </td>
    </tr>
    <tr>
        <td>门店名称</td>
        <td>
            <input type="text" v-model="shop.Shop_Name">
        </td>
    </tr>
    <tr>
        <td>分店名称</td>
        <td>
            <input type="text" v-model="shop.Shop_BranchName">
        </td>
    </tr>
    <tr>
        <td>门店住宅</td>
        <td>
            <input type="text" v-model="shop.Shop_Address">
        </td>
    </tr>
    <tr>
        <td>联系方式</td>
        <td>
            <input type="text" v-model="shop.Shop_Phone">
        </td>
    </tr>
    <tr>
        <td>门店状态</td>
        <td>
            <input type="radio" :value="true" v-model="shop.Shop_State"/>正常
            <input type="radio" :value="false" v-model="shop.Shop_State"/>关闭
        </td>
    </tr>
    <tr>
        <td>门店介绍</td>
        <td>
           <textarea rows="3" v-model="shop.Shop_Info"></textarea>
        </td>
    </tr>
    <tr>
        <td>入住须知</td>
        <td>
            <textarea rows="3" v-model="shop.Shop_Notice"></textarea>
        </td>
    </tr>
    <tr>
        <td>交通信息</td>
        <td>
            <textarea rows="3" v-model="shop.Shop_Traffic"></textarea>
        </td>
    </tr>
    <tr>
        <td></td>
        <td>
            <input type="button" value="修改" @click="editShop">
        </td>
    </tr>
    </table>
</template>

<script setup lang="ts">
    import {ref,onMounted} from 'vue'
    import {useRouter} from 'vue-router'
    const router=useRouter();
    import axios from 'axios'
    const params=new URLSearchParams(location.search);
    const sid=params.get('sid');
    const file=ref(null);
    const fileUpLoad=(e)=>{
        file.value=e.target.files[0];
        if(!file.value)
        {
            alert('请上传文件');
            return;
        }
        const formData=new FormData();
        formData.append('images',file.value);
        axios.post('https://localhost:44320/api/Files/FileUpLoad',formData)
        .then(res=>{
            console.log(res.data);
            if(res.data.StateCode==1)
            {
                alert(res.data.StateMessage);
                shop.value.Shop_Img=res.data.StateData;
            }
            else if(res.data.StateCode==2)
            {
                alert(res.data.StateMessage);
            }
            else
            {
                alert(res.data.StateMessage);
            }
        })
    }


    const shop=ref( {
      "Shop_Id": 1,
      "Shop_Img": "",
      "Shop_Name": "",
      "Shop_BranchName": "",
      "Shop_Address": "",
      "Shop_Phone": "",
      "Shop_State": true,
      "Shop_Info": "",
      "Shop_Notice": "",
      "Shop_Traffic": "",
      "Shop_InfoState": false,
      "Shop_InfoStateTime": "2024-08-25T18:59:53.0752846"
    })
    const editShop=()=>{
        axios.put('https://localhost:44320/api/Shop/ShopEdit',{
            "shop_Id": sid,
            "Shop_Img": shop.value.Shop_Img,
      "Shop_Name": shop.value.Shop_Name,
      "Shop_BranchName":  shop.value.Shop_BranchName,
      "Shop_Address":  shop.value.Shop_Address,
      "Shop_Phone":  shop.value.Shop_Phone,
      "Shop_State":  shop.value.Shop_State,
      "Shop_Info": shop.value.Shop_Info,
      "Shop_Notice":  shop.value.Shop_Notice,
      "Shop_Traffic":  shop.value.Shop_Traffic
        })
        .then(res=>{
            if(res.data==-1)
            {
                alert('门店名称不能修改');
            }
            else if(res.data>0)
            {
                alert('修改成功');
                router.push('/showShop');
            }
            else
            {
                alert('修改失败');
            }
        })
    }
    onMounted(()=>{
        axios.get('https://localhost:44320/api/Shop/ShopBack',{
            params:{
                sid:sid
            }
        })
        .then(res=>{
            shop.value=res.data;
        })
    })

</script>